<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>http-mock</title>
    <script src="/static/js/jquery-1.10.2.min.js" type="application/javascript"></script>
</head>
<body>
<div id="app">
    接收数据列表(每10分钟自动清理，最多剩100条记录)
    <br/>
    <div id="example-1">
        <input type="button" value="清除所有" onclick="clearAll()">
        <input type="button" value="刷新" onclick="loadData()">
        <input type="button" value="testlist" onclick="testlist()">
    </div>
</div>


<div id="app2">
    <ul id="ds">
<!--        <li>asdfasdf</li>-->
<!--        <li>asdfadd</li>-->
    </ul>
</div>

<script>
    function repalceHtmlToText(str) {
        str = str.replace(/</g, "&lt;");
        str = str.replace(/>/g, "&gt;");
        // str = str.replace(/&nbsp;/g, "");
        return str;
    }
    function loadData() {
        // let param = {filter: this.filters.name};
        // axios.post('/user/userlist', qs.stringify(param)).then((result) = > {
        // axios.post('/datalist', '').then((result) => {
        //     var _data = result.data;
        // 	this.tableData = _data;
        // });

        $.ajax({
            type: "get",
            url: "/datalist",
            async: true,
            success: function (result) {
                var list = result.data;
                var str="";
                for (var idx in list){
                    str=str+"<li>"+repalceHtmlToText(list[idx])+"</li>";
                }
                $("#ds").html(str);
            },
        });
    }

    function clearAll() {
        $.ajax({
            type: "get",
            url: "/clear",
            async: true,
            success: function (result) {
                $("#ds").html("");
            },
        });
    }
    function testlist() {
        $.ajax({
            type: "get",
            url: "/testlist",
            async: true,
            success: function (result) {
                // $("#ds").html("");
                loadData();
            },
        });
    }
    // var Ctor = Vue.extend(Main)
    // new Ctor().$mount('#app2')
    $(window).load(function() {
        loadData();
    });
</script>
</body>
</html>